import BaseView from '../BaseView';
import utils from '../../utils';

export default class RectView extends BaseView {
    public bgColor: string = '#ffffff';
    private round = 0;

    public async draw(ctx: CanvasRenderingContext2D) {
        const x = this.getDrawX();
        const y = this.getDrawY();
        const w = this.getDrawWidth();
        const h = this.getDrawHeight();
        const r = this.getRound();
        ctx.save();
        ctx.fillStyle = this.getBgColor();
        ctx.beginPath();
        ctx.moveTo(x + r, y);
        ctx.arcTo(x + w, y, x + w, y + r, r);
        ctx.arcTo(x + w, y + h, x + w - r, y + h, r);
        ctx.arcTo(x, y + h, x, y + h - r, r);
        ctx.arcTo(x, y, x + r, y, r);
        ctx.fill();
        ctx.restore();
        await super.draw(ctx);
    }

    public setBgColor(bgColor: string) {
        this.bgColor = bgColor;
    }
    public getBgColor() {
        return this.bgColor;
    }

    public setRound(round: number) {
        this.round = round;
    }
    public getRound() {
        return this.round;
    }

    public getDrawRound() {
        return utils.getScaleRatioSize(this.getRound());
    }


}
